<!DOCTYPE html>
<html lang=en>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>ExamPage</title>
        <meta charset="utf-8"> 
        
        <script type="text/javascript" src="../js/jquery-1.6.js" ></script>
		<script type="text/javascript" src="../js/config.js"></script>
	    <script type="text/javascript" src="../js/common.js"></script>
		<script type="text/javascript" src="../js/easyui/jquery.easyui.min.js"></script>
        <script type="text/javascript" src="newexam.js"></script>
        <style>
            .labelSet {
                display: inline;
                margin-top: 20px;
                margin: 20px 10px 10px 10px;
            }
            .logo {
                display: inline;
                
            }
            .passage {
            	border: thin;
            	white-space:normal; 
            	width:1200px;
            	text-size:20px
            	
            }
            .part {
            	border-width: 3px;
            	border-style: solid;
            }
        </style>
    </head>
    <body>
        <header>
            <div class="logod container-fluid">
                <div class="row-fluid">
                	<h1 id="examName" style="text-align: center"></h1>
                	<div class="span2" >
                	<h3>Welcome <em id="stuName"></em>
                	    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                	    ExamDate:<i id="examDate"></i></h3>
                	</div>
                	
                	<em id="timer" style="color:red; text-align: right"></em>
                </div>
            </div>
        </header>
        <form method="post" id="examContent">
        	<div id="listen" class="part">
        		<label class="labelSet"><b>Listening Directions:</b></label><br>
        		<em id="listenDirections" ></em><br>
        		<object data="../listeningMaterials/m1.mp3" height="40px"></object><br>
        		<label class="labelSet"><b>Listening Passage:</b></label>
        		<p id="listenPassage" class="passage" ></p><br>  
        		<label class="labelSet"><b>Your answers:</b></label>
        		<input id="listenAnswers" name="listenAnswers" width="1000px"></input>	
        	</div><br> 
        	<div id="selection" class="part">
        		<label class="labelSet"><b>Selection Directions:</b></label><br>
        		<em id="selectionDirections" ></em><br>
        		<label class="labelSet"><b>Words:</b></label>
        		<p id="selectionPassage" class="passage" ></p><br>  
        		<label class="labelSet"><b>Questions:</b></label>
        		<p id="selections" class="passage" ></p><br> 
        		<label class="labelSet"><b>Your answers:</b></label>
        		<input id="selectionAnswers" name="selectionAnswers" width="1000px"></input>
        		
        	</div><br>
        	<div id="translate" class="part">
        		<label class="labelSet"><b>Translate Directions:</b></label><br>
        		<em id="translateDirections" ></em><br>
        		<label class="labelSet"><b>Translate Sentences:</b></label>
        		<p id="translatePassage" class="passage" ></p><br>  
        		<label class="labelSet"><b>Your answers:</b></label>
        		<input id="translateAnswers" name="translateAnswers" width="1000px"></input>
        	</div><br>
        	<div id="rewrite" class="part">
        		<label class="labelSet"><b>Rewrite Directions:</b></label><br>
        		<em id="rewriteDirections" ></em><br>
        		<label class="labelSet"><b>Rewrite Sentences:</b></label>
        		<p id="rewriteSentences" class="passage" ></p><br>  
        		<label class="labelSet"><b>Your answers:</b></label>
        		<input id="rewriteAnswers" name="rewriteAnswers" width="1000px"></input>
        	</div><br>
        	<div id="read" class="part">
        		<label class="labelSet"><b>Reading Directions:</b></label><br>
        		<em id="readDirections" ></em><br>
        		<label class="labelSet"><b>Reading Materials:</b></label>
        		<p id="readPassage" class="passage" ></p><br>  
        		<label class="labelSet"><b>Your answers:</b></label>
        		<input id="readAnswers" name="readAnswers" width="1000px"></input>
        	</div><br>
        	<div id="write" class="part">
        		<label class="labelSet"><b>Writing Content:</b></label><br>
        		<p id="writeContent" class="passage" ></p><br>  
        		<label class="labelSet"><b>Your answers:</b></label>
        		<input id="writeAnswers" name="writeAnswers" width="1000px"></input>
        	</div><br>
        	<input type="submit" value="Submit"></input>
        </form>
    </body>
<script>
    $('#add_type').click(function() {
        $('dropdown-menu').toggle();
        alert("hi");
    });
    $('.dropdown-toggle').click(function() {
        $(this).dropdown();
    });
    
</script>
</html>
